<html>

    <head>
        <title>ODS Parser</title>
        <link rel="stylesheet" href="static/css/reset.css" />
        <link rel="stylesheet" href="static/css/main.css" />
        <script type="text/javascript" src="static/js/jquery.js"></script>
        <script type="text/javascript" src="static/js/global.js"></script>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    
    <body>
        <div id="main-container">
            <div id="header">
                <div id="header-block"></div>
                <div id="logo">ODS Parser</div>
            </div>
            <div style="float: left; width: 45%;">
                <p id="registered-modules"></p>
                <p><input type="text" id="link" /></p>
                <p><textarea id="output-pattern">
                    <span style="font-size: 150%;"><b>{artists}</b> - {title}</span>
                    <b>Release Date</b>: {release_date}
                    <b>Genres</b>: {genres}
                    <b>Label</b>: {label}
                    <b>Catalog</b>: {catalog}
                    <span style="font-size: 20px; font-family: Calibri;">Tracklist:</span>
                    {{tracklist}}
                    {track_num}. {track_artists} - {track_title} ({track_length})
                    {{/tracklist}}
                </textarea>
                </p>
                <p><button id="parse-button">Начать парсинг</button></p>
            </div>
            <div style="float: right; overflow: scroll; width: 45%;" id="result">
                <div id="parsing-results">
                </div>
            </div>
        </div>
    </body>

</html>
